{% extends "BillingBundle::user_layout.html.twig" %}

{% macro field(row, lname, label) %}
    <tr>
        <td class="label">
            <label id="l{{ lname }}" for="{{ lname }}">{{ label }}:</label>
        </td>
        <td class="field">
            {{ form_widget(row) }}
        </td>
        <td class="status"></td>
        <td>
            {{ form_errors(row) }}
        </td>
    </tr>
{% endmacro %}

{% block content %}

<link rel="stylesheet" type="text/css" media="screen" href="{{ asset('bundles/billing/css/validate.css') }}" />
<script src="{{ asset('bundles/billing/js/jquery.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/billing/js/jquery.validate.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/billing/js/validate_vps_order.js') }}" type="text/javascript"></script>

<body onLoad="javascript:addOptions()">

<tr>
	<td class="content">
		<div class="wrapper">
			<h1 class="ml">Изменение заказа на VPS:</h1>
		</div>
		<div class="wrapper">
                <div id="add_box">
                  <div id="add_wrap">
                    <form id="add_form" method="post" action="#">
                        <table>
                           <tr>
                                <td class="label">
                                    <label id="lvps_tarif" for="vps_tarif">Тариф:</label>
                                </td>
                                <td>
                                    {{ form_widget(form.vps_tarif, { 'attr': { 'onChange': 'makeFromTarif(this.value); addOptions();'} }) }}
                                </td>
                                <td>
                                    Общая стоимость:<input type="static" name="summ" id="summ" value=""></input>
                                </td>
                           </tr>
                           {{ form_widget(form._token) }}
                        <tr>
                            <td>
                            <div class="field">
                                <input name="add_order" type="submit" value="Изменить"/>
                            </div>
                            </td>
                        </tr>
                        </table>
                    </form>
                   </div>
                </div>
		</div>
		<div class="end"></div>
	</td>
</tr>
</body>

<script type="text/javascript">
function makeFromTarif(value)
{
    var c = 0;
    {% for key, cost in costById %}
        if ({{key}} == value)
        {
            c = {{cost}}
        }
    {% endfor %}
    var period = document.getElementById('ordersvps_period');
    var summ = period.value*30*c;
    var label = document.getElementById('summ');
    label.value = summ;
}
function makeFromPeriod(value)
{
    var tarif = document.getElementById('ordersvps_vps_tarif');
    var c = 0;
    {% for key, cost in costById %}
        if ({{key}} == tarif.value)
        {
            c = {{cost}}
        }
    {% endfor %}
    var summ = value*30*c;
    var label = document.getElementById('summ');
    label.value = summ;
}
function addOptions()
{
    var objSel = document.getElementById("ordersvps_vps_tarif");
    var periods = document.getElementById("ordersvps_period");
    var indSel = objSel.options[objSel.selectedIndex].value;
    periods.options.length = 0;
    {% for key, tarifTerm in tarifTerms %}
        if ({{key}} == indSel)
        {
            {% for term in tarifTerm %}
                periods.options[periods.options.length] = new Option("{{ term }} мес.", "{{ term }}");
            {% endfor %}
        }
    {% endfor %}
}
</script>

{% endblock %}